<div class="content-section implementation GridDemo clearfixes">
  <div class="mysearch">
    <ng-container *ngFor="let tab of tabs;let i = index">
      <button pButton type="button"  label="{{tab.label}}" (click)="changeTab(i)"></button>
    </ng-container>
  </div>
  <ng-container [ngSwitch]= tabIndex>
    <div class="contentInfo" *ngSwitchCase="0" >
      <form class="form-horizontal storage" [formGroup]="shelfForm"   >
    <p-panel >
      <p-header>
        <div class="ui-helper-clearfix">
          <span class="ui-panel-title" style="font-size:16px;display:inline-block;margin-top:2px"></span>
          <button class="save"  pButton type="button"  label="返回" (click)="goBack()"  > </button>
          <button class="save" pButton [ngStyle]="{'float':'right'}"   *ngFor="let optbutton of optButtons"  label="{{optbutton.label}}" (click)="approvedOption(optbutton.status)"  ></button>

        </div>
      </p-header>
      <div class="ui-grid ui-grid-responsive ui-grid-pad ui-fluid" style="margin: 10px 0px">
        <div class="ui-g margin-bottom-1vw">
          <div class="ui-g-6 ui-md-2 ui-lg-1 ui-padding-10px text-right">
            <label >上架单号:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input  formControlName="sid"  name="sid"   type="text" pInputText   placeholder=""  readonly [(ngModel)]="detailData.sid">
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
            <label >状态:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input  formControlName="status"  name="sid"   type="text" pInputText   placeholder=""  readonly [(ngModel)]="detailData.status">
          </div>
        </div>
        <div class="ui-g margin-bottom-1vw">
          <div class="ui-g-6 ui-md-2 ui-lg-1 text-right">
            <label >申请人:</label>
          </div>

          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="creator"  type="text" pInputText  name="creator" placeholder=""
                   readonly class="cursor_not_allowed"  [(ngModel)]="detailData.applicant" />
          </div>

          <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
            <label >申请人组织:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="creator_org" pInputText type="text"  name="startTime" [(ngModel)]="detailData.applicant_org" readonly   class="no-border"/>
          </div>
        </div>
        <div class="ui-g margin-bottom-1vw">
          <div class="ui-g-6 ui-md-6 ui-lg-1 ui-padding-10px text-right">
            <label >上架类型:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="assetshelve_type" pInputText type="text"  name="startTime" [(ngModel)]="detailData.assetshelve_type"  readonly   class="no-border"/>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
            <label >部门审批人:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="org_approver" pInputText type="text"  name="startTime" [(ngModel)]="detailData.approve"  readonly   class="no-border"/>
          </div>

        </div>
        <div class="ui-g margin-bottom-1vw" >
          <div class="ui-g-6 ui-md-6 ui-lg-1 text-right">
            <label ><span></span>计划上架时间:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="assetshelve_plantime_begin" pInputText type="text"  name="startTime" [(ngModel)]="detailData.assetshelve_plantime_begin"  readonly   class="no-border"/>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-3 text-right ">
            <label ><span></span>计划完成时间:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="assetshelve_plantime_end" pInputText type="text"  name="startTime" [(ngModel)]="detailData.assetshelve_plantime_end"  readonly   class="no-border"/>
          </div>
        </div>
        <div class="ui-g margin-bottom-1vw">
          <div class="ui-g-6 ui-md-6 ui-lg-1 ui-padding-10px text-right">
            <label >预计使用周期:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input  formControlName="usage_time"  name="usage_time"   type="text" pInputText   placeholder="" [(ngModel)]="detailData.usage_time"  readonly>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
            <label ><span></span>计划上架区域:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="assetshelve_location"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                   readonly class="cursor_not_allowed"  [(ngModel)]="detailData.assetshelve_location" />
          </div>
        </div>
        <div class="ui-g margin-bottom-1vw">
          <div class="ui-g-6 ui-md-6 ui-lg-1 text-right">
            <label ><span></span>关联预占单号:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="preoccupied_sid"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                   readonly class="cursor_not_allowed"  [(ngModel)]="detailData.preoccupied_sid" />
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-3 ui-padding-10px text-right">
            <label >供应电极:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-4">
            <input formControlName="power_level"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                   readonly class="cursor_not_allowed"  [(ngModel)]="detailData.power_level" />
          </div>
        </div>
        <div class="ui-g margin-bottom-1vw">
          <div class="ui-g-6 ui-md-6 ui-lg-1 text-right">
            <label ><span></span>上架原因:</label>
          </div>
          <div class="ui-g-6 ui-md-6 ui-lg-11">
            <textarea formControlName="assetshelve_reason" name="jianshu" pInputTextarea type="text" [(ngModel)]="detailData.assetshelve_reason" readonly></textarea>
          </div>
        </div>
        <div class="ui-grid-row margin-bottom-1vw">
          <div class="ui-grid-col-1 text-right">
            <label ><span>*</span>审批意见:</label>
          </div>
          <div class="ui-grid-col-11">
            <textarea formControlName="approve_remarks" name="jianshu" pInputTextarea type="text" [(ngModel)]="approvedModel.approve_remarks" ></textarea>
            <div class="ui-message ui-messages-error ui-corner-all "   *ngIf="!shelfForm.controls['approve_remarks'].valid&&(!shelfForm.controls['approve_remarks'].untouched)" >
              <i class="fa fa-close"></i>
              审批意见必填
            </div>
          </div>
        </div>
        <div class="ui-grid-row margin-bottom-1vw">
          <div class="ui-grid-col-1 ui-padding-10px text-right">
            <label >下一审批角色:</label>
          </div>
          <div class="ui-grid-col-3">
            <input formControlName="next_approver_org"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                   readonly class="cursor_not_allowed"  [(ngModel)]="approvedModel.next_approve_org" />

          </div>
          <div class="ui-grid-col-1">
            <button pButton  type="button" (click)="showShelfMask()" label="选择" ></button>
          </div>
          <div class="ui-grid-col-1">
            <button pButton  (click)="clearTreeDialog()" label="清空" ></button>
          </div>
          <div class="ui-grid-col-1 text-right">
            <label >下一审批人:</label>
          </div>
          <div class="ui-grid-col-5">
            <p-dropdown [autoWidth]="false" formControlName="next_approver" [options]="dropDownData"  name="fenlei" [(ngModel)]="approvedModel.next_approve" ></p-dropdown>

          </div>
        </div>
        <div class="ui-grid-row margin-bottom-1vw">
          <div class="ui-grid-col-1 text-right">
            <label ><span>*</span>执行人组织:</label>
          </div>
          <div class="ui-grid-col-3">
            <input formControlName="executor_org"  type="text" pInputText  name="" placeholder=""
                   readonly class="cursor_not_allowed"  [(ngModel)]="approvedModel.executor_org"/>
            <div class="ui-message ui-messages-error ui-corner-all "   *ngIf="!shelfForm.controls['executor_org'].valid&&(!shelfForm.controls['executor_org'].untouched)" >
              <i class="fa fa-close"></i>
              执行人组织必填
            </div>
          </div>
          <div class="ui-grid-col-1">
            <button pButton  type="button" (click)="showExecutorMask()" label="选择" ></button>
          </div>
          <div class="ui-grid-col-1">
            <button pButton  (click)="clearExecutorDialog()" label="清空" ></button>
          </div>
          <div class="ui-grid-col-1 ui-padding-10px text-right">
            <label >上架执行人:</label>
          </div>
          <div class="ui-grid-col-5">
            <p-dropdown [autoWidth]="false" formControlName="executor" [options]="executorDownData"  name="fenlei" [(ngModel)]="approvedModel.executor" ></p-dropdown>
          </div>
        </div>
      </div>
    </p-panel>
    <label></label>
    <label><span></span>待上架设备列表</label>
    <p-dataTable [value]="devices" [lazy]="true" [rows]="10" [paginator]="true"
                 [totalRecords]="totalRecords"  [(selection)]="selectConstructions" [editable]="true"   [rowsPerPageOptions]="[5,10,20]">
      <p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>
      <p-column  field="ano" header="设备编号" [sortable]="true" >
        <ng-template let-data="rowData" pTemplate="body" let-i="rowIndex">
          <span (click)="viewOption(data)" class="curser">{{data.ano}}</span>
        </ng-template>
      </p-column>
      <p-column  *ngFor="let col of cols" field="{{col.field}}" header="{{col.header}}" [editable]="col.editable" [sortable]="true"></p-column>
      <p-column  field="data" header="上架位置" [sortable]="true" >
        <ng-template let-data="rowData" pTemplate="body" let-i="rowIndex">
          <span>{{data['timeGroup']}}</span>
        </ng-template>
      </p-column>
      <p-column header="操作">
        <ng-template let-car="rowData" pTemplate="body" let-i="rowIndex">
          <button  pButton type="button"  label="编辑"  (click)="updateOption(dataSource[i],'update',i)"></button>
        </ng-template>
      </p-column>
      <ng-template pTemplate="emptymessage" >
        当前没有数据
      </ng-template>

    </p-dataTable>
  </form>
    </div>
    <div class="associatedEquipment" *ngSwitchCase="1" >
      <p-dataTable [value]="detailData.approval_process"  [lazy]="true" [rows]="10" [paginator]="true"
                   [totalRecords]="totalRecords"  [(selection)]="selectInsepections" >
        <!--<p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>-->
        <p-column  *ngFor="let col of asscitedCols" field="{{col.field}}" header="{{col.header}}"></p-column>
        <ng-template pTemplate="emptymessage">
          当前没有数据
        </ng-template>
      </p-dataTable>
    </div>
    <div class="Operationlog" *ngSwitchCase="2">
      <p-dataTable [value]="detailData['operations']"  [lazy]="true" [rows]="10" [paginator]="true"
                   [totalRecords]="totalRecords"  [(selection)]="selectInsepections" >
        <!--<p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>-->
        <p-column  *ngFor="let col of OperationLogCols" field="{{col.field}}" header="{{col.header}}"></p-column>
        <ng-template pTemplate="emptymessage">
          当前没有数据
        </ng-template>


      </p-dataTable>
    </div>
  </ng-container>
</div>
<app-add-shelf-tree
  *ngIf="showAddShelf"
  (closeAddMask)="closeShelfMask($event)"
  (addTree)="addPlanOrg($event)"
></app-add-shelf-tree>
<app-executor
  *ngIf="showexecutor"
  (closeAddMask)="closeExecutorMask($event)"
  (addTree)="addExecutorOrg($event)"
></app-executor>
<app-shelf-add-or-update-devices
  *ngIf="showAddMask"
  [state]="state"
  (closeAddMask)="removeMask($event)"
  [currentAsset]="tempAsset"
  (updateDev)="updateShelf($event)"
>
</app-shelf-add-or-update-devices>
<app-asset-detail
  *ngIf="showViewDetailMask"
  [currentAsset]="tempAsset"
  (closeDetailMask)="closeViewDetail($event)">
  ></app-asset-detail>
